<template>
	<view>
		<!-- 搜索框 -->
		<view class="search_view">
			<u-search shape="square" :show-action="true" action-text="搜索" :clearabled="true" :animation="true"
				v-model="keywords" @change="getSearch">
			</u-search>
		</view>
		<view class="list" v-if="buffer">
			<view class="row" v-for="item in searchList" @click="toDetail(item.id)" :key="item.id">
				<image :src="item.img" mode="widthFix"></image>
				<view class="info">
					<text>{{item.goodsname}}</text>
					<text>￥{{item.price}}</text>
					<text>3565评论</text>
				</view>
			</view>
		</view>
		<view class="api" v-else>
			没有数据亲！
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				buffer: false, //页面显示开关,
				keywords: '', //初始化搜索关键词
				searchList: [], // 搜索列表
			}
		},
		onLoad(options) {

		},

		methods: {
			// 路由跳转到详情页面
			toDetail(id) {
				uni.navigateTo({
					url: `/pages/gooddesc/gooddesc?id=${id}`
				})
			},

			// 搜索
			getSearch(keywords) {
				let data = {
					keywords,
				}
				if (keywords === '') {
					this.buffer = false;
					return
				}
				this.$http({
					url: '/api/search',
					data,
				}).then(res => {
					if (res.data.code === 200 && res.data.list === null) {
						this.buffer = false
						return;
					}
					this.buffer = true;
					res.data.list.forEach(item => {
						item.img = this.$pregImg + item.img;
					});
					this.searchList = res.data.list;
					console.log(res);
				})
			}
		},

	}
</script>

<style>
	/* 引入样式 */
	@import url("@/static/css/search.css");
</style>